<template>
    <div>
        <Upload ref="uploadFile" :action="uploadUrl" :type="type" :accept="accept" :paste="paste" :max-size="maxSize" name="file"
                 :format="format" multiple 
                :on-success="uploadSuccess" :on-error="unloadError" :on-format-error="uploadFormatError"
                :on-exceeded-size="uploadExceededSize">
            <slot></slot>
        </Upload>
    </div>

</template>

<script>
    export default {
        name: "upload",
        props: {
            format: Array,      // 支持的文件类型，与 accept 不同的是，format 是识别文件的后缀名，accept 为 input 标签原生的 accept 属性，会在选择文件时过滤，可以两者结合使用
            type: String,       // 上传控件的类型，可选值为 select（点击选择），drag（支持拖拽）
            maxSize: Number,    // 文件大小限制，单位 kb
            paste: Boolean,     // 是否支持粘贴上传文件
            accept: String      // 接受上传的文件类型
        },
        data() {
            return {
                // 上传文件URL
                uploadUrl: this.$uploadUrl,
				path:""
              
            };
        },
        mounted() {
         
        },
        methods: {
            // 上传成功
            uploadSuccess(res, file) {
                let _res = {res: res, file: file};
                this.$refs.uploadFile.clearFiles();
                this.$emit('success', _res);	
            },
            // 上传失败
            unloadError(error, file,) {
                let _res = {res: error, file: file};
                this.$refs.uploadFile.clearFiles();
                this.$emit('error', _res)
            },
            // 上传格式错误时
            uploadFormatError(file) {
                let _res = {file: file};
                this.$refs.uploadFile.clearFiles();
                this.$emit('formatError', _res)
            },
            // 文件超出限制大小时
            uploadExceededSize(file) {
                let _res = {file: file};
                this.$refs.uploadFile.clearFiles();
                this.$emit('exceededSize', _res)
            },
			
           
        }
    }
</script>

<style scoped>

</style>